<style>
    #login-button{
        background: #286090!important;
        color: white!important;
        border: 1px solid #286090!important;
        border-radius: 3px;
    }
    .up_file {  position:relative;  text-decoration:none; text-indent:0;margin-top: -10px}
    .up_file input { position:absolute; right:0; top:0; opacity:0; width: 100%;}
</style>
<script type="text/javascript" charset="utf-8" src="/ueditor/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="/ueditor/ueditor.all.min.js"> </script>
<script type="text/javascript" charset="utf-8" src="/ueditor/lang/zh-cn/zh-cn.js"></script>
<script type="text/javascript" src="/My97DatePicker/WdatePicker.js"></script>

<div class="span10">
    <div style="margin-bottom: 20px;">
        <a href="/index/index">首页</a><span >&gt;</span><span>口语题库</span><span >&gt;</span><span>添加/修改</span>
    </div>

    <form name="form" method="post" action="<?php echo baseUrl."/content/speak/add-list"?>" enctype="multipart/form-data">
        <table>
            <tr>
                <td>选择Part:</td>
                <td>
                    <select name="part">
                        <option value ="">请选择Part</option>
                        <option value ="1" <?php echo isset($data)&& $data['part']==1 ?  'selected':''?>>Part1</option>
                        <option value ="2" <?php echo isset($data)&& $data['part']==2 ?  'selected':''?>>Part2</option>
                        <option value ="3" <?php echo isset($data)&& $data['part']==3 ?  'selected':''?>>Part3</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>题目音频:</td>
                <td>
                    <input type="text" value="<?php echo isset($data)? $data['audio']:''?>" class="audio" name="audio">
                    <a href="#" class="btn btn-info up_file">上传音频<input type="file" onchange="upAudio(this)" accept="audio/*"/></a>
                </td>
            </tr>
            <tr>
                <td>口语题目:</td>
                <td>
                    <textarea name="question" id="editor" style="width: 700px;height: 300px;"><?php echo isset($data)? $data['question']:''?></textarea>
                </td>
            </tr>
            <tr>
                <td>点击量:</td>
                <td>
                    <input type="text" name="viewCount" value="<?php echo isset($data)? $data['viewCount']:''?>" />
                </td>
            </tr>
            <tr>
                <td>老师录音:</td>
                <td>
                    <input type="text" value="<?php echo isset($data)? $data['teacherAudio']:''?>" class="teacherAudio" name="teacherAudio">
                    <a href="#" class="btn btn-info up_file">上传音频<input type="file" onchange="upAudio(this)" accept="audio/*"/></a>
                </td>
            </tr>
            <tr>
                <td>老师名字:</td>
                <td>
                    <input type="text" name="teacherName" value="<?php echo isset($data)? $data['teacherName']:''?>" />
                </td>
            </tr>
            <tr>
                <td colspan="2" align="right">
                    <input type="hidden" name='pid' value="<?php echo $pid ?>"/>
                    <input type="hidden" name='id' value="<?php echo isset($data)? $data['id']:''?>"/>
                    <button type="submit" id="login-button">添加/修改</button></td>
            </tr>
            <input type="hidden" name="_csrf" value="<?=Yii::$app->request->getCsrfToken()?>" />
        </table>
    </form>

</div>
<script type="text/javascript">
    var editor = UE.getEditor('editor');

    function upAudio(obj) {
        var data = new FormData();
        var file = $(obj).get(0).files[0];
        if(!file){
            return false;
        }
        data.append('file', file);
        $.ajax({
            type: 'POST',
            url: "/content/api/upload",
            dataType: "json",
            contentType:false,
            processData: false,
            data: data,
            success: function(res) {
                alert(res.message)
                if(res.code == 1){
                    $(obj).parents('td').find('input[type="text"]').val(res.path);
                }
            },
            error: function(e){
                alert('系统错误，请重试')
            },
        });
    }
</script>